import { } from 'react'
import { NavBar, Divider, Button } from 'antd-mobile'
import { useNavigate } from 'react-router-dom'
import styles from "./index.module.css";
const index = () => {
    const nav = useNavigate()
    const gp = () => {
        alert('改签成功')
        nav('/')
    }
    return (
        <div>
            <NavBar onBack={() => nav(-1)}>改签</NavBar>
            <div>
                <div className={styles.gaip_biao}>
                    <p>05月13日 周一</p>
                    <div className={styles.gaip_biao1}>
                        <h3>21:03</h3>
                        <p>合肥南</p>
                    </div>
                    <div className={styles.gaip_biao2}>
                        <p>D3212</p>
                        <Divider />
                        <p>1h 12m</p>
                    </div>
                    <div className={styles.gaip_biao1}>
                        <h3>21:03</h3>
                        <p>合肥南</p>
                    </div>
                </div>
            </div>
            <h3 style={{ textAlign: 'center', paddingTop: '10px' }}>请选择需要改签的乘客</h3>
            <Divider />
            <div className={styles.gaip_biao3}>
                <p>迪丽热巴<span className={styles.one}>￥188</span></p>
                <p>身份证: 411380*********666</p>
                <p>二等座 01车07c号</p>
            </div>
            <div className={styles.gaip_biao3}>
                <p>刘强东<span className={styles.two}>￥188</span></p>
                <p>身份证: 311381*********888</p>
                <p>二等座 01车07c号<span className={styles.three}>已改签</span></p>
            </div>
            <div className={styles.detail_button}>
                <p>
                    <Button size='large' style={{ background: '#3e3d3dff', color: '#fff', width: '450px', height: '70px', marginLeft: '30px' }} onClick={() => gp()}>
                        改签
                    </Button>
                </p>
            </div>
        </div>
    )
}

export default index
